<!-- modals.html -->
<dialog id="genericModal" class="modal">
    <div class="modal-box p-0 overflow-hidden max-w-lg shadow-2xl">
        <div class="modal-header bg-gradient-to-r from-indigo-600 to-purple-600 p-8 text-white">
            <div class="flex justify-between items-start">
                <div>
                    <h3 class="font-bold text-2xl flex items-center modal-title">
                        <i class="modal-icon mr-3"></i>
                        <span class="modal-title-text">模态框标题</span>
                    </h3>
                    <p class="text-indigo-200 mt-2 modal-description">模态框描述</p>
                </div>
                <button class="btn btn-sm btn-circle btn-ghost text-white" onclick="closeGenericModal()">
                    <i class="fas fa-times"></i>
                </button>
            </div>
        </div>

        <div class="p-8">
            <form id="genericModalForm" class="space-y-6">
                <!-- 动态表单内容将在这里生成 -->
            </form>
        </div>

        <div class="flex justify-end gap-4 px-8 pb-8 -mt-4">
            <button class="btn btn-outline rounded-xl px-6 py-2" onclick="closeGenericModal()">
                <i class="fas fa-times mr-2"></i>取消
            </button>
            <button class="btn btn-primary rounded-xl px-6 py-2 bg-gradient-to-r from-indigo-500 to-purple-500 border-0 hover:shadow-lg transition-all" id="genericModalSubmit">
                <i class="modal-submit-icon mr-2"></i>
                <span class="modal-submit-text">保存</span>
            </button>
        </div>
    </div>
</dialog>